// import { Configuration } from "webpack";
/**
 * @type {Configuration}
 */
const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const { CleanWebpackPlugin } = require("clean-webpack-plugin");
const ExtractTextPlugin = require('extract-text-webpack-plugin')
const config = {
  entry: "./src/index.js",

  plugins: [
    new CleanWebpackPlugin({
      cleanOnceBeforeBuildPatterns: [path.resolve(__dirname, "output")]
    }),
    new HtmlWebpackPlugin({
      title: "output management"
    }),
    new ExtractTextPlugin({
      filename: `[name]_[hash:8].css`
    })
  ],
  output: {
    filename: "bundle.js",
    path: path.join(__dirname, "dist")
  },
  module: {
    rules: [
      // {
      //   test: /\.css$/,
      //   use: ["style-loader", "css-loader"]
      // }
      {
        test: /\.css$/,
        use: ExtractTextPlugin.extract({
          use: ['css-loader']
        })
      }
    ]
  }
};

module.exports = config;
